<link href="/styles/mui.picker.css" rel="stylesheet" type="text/css">
<header class="mui-bar mui-bar-nav header">
  <a class="mui-action-back mui-icon mui-pull-left" href=""><i class="iconfont">&#xe602;</i></a>
  <h1 class="mui-title">新增地址</h1>
  <a class="mui-action-back mui-icon mui-pull-right" href="search.html"><i class="iconfont">&#xe601;</i></a>
</header>
<div class="mui-content">
  <form class="mui-input-group">
    <div class="mui-input-row">
      <label>收件人</label>
      <input type="text" class="mui-input-clear" placeholder="" id="receiver">
    </div>
    <div class="mui-input-row">
      <label>手机</label>
      <input type="number" class="mui-input-clear" placeholder="" id="phone">
    </div>
    <div class="mui-input-row">
      <label>国家</label>
      <input type="text" class="mui-input-clear" placeholder="" id="country">
    </div>
    <div class="mui-input-row">
      <label>省市</label>
      <input type="text" class="mui-input-clear" id="city-picker">
    </div>
    <div class="mui-input-row">
      <label>地址</label>
      <input type="text" class="mui-input-clear" placeholder="" id="detail">
    </div>
    <div class="mui-button-row">
      <button type="button" class="mui-btn mui-btn-primary" >确认</button>
      <button type="button" class="mui-btn mui-btn-danger" >取消</button>
    </div>
  </form>
</div>
<script src="/js/mui.picker.min.js"></script>
<script src="/js/data.city.js"></script>
<script>
  var city_picker = new mui.PopPicker({layer:3});
  city_picker.setData(init_city_picker);
  $("#city-picker").on("tap", function(){
    setTimeout(function(){
      city_picker.show(function(items){
        $("#city-picker").val((items[0] || {}).text + " " + (items[1] || {}).text + " " + (items[2] || {}).text);
      });
    },200);
  });
</script>
<script>
  $('.mui-btn-primary').click(function () {
    var reqBody = {
      openid: sessionStorage.getItem('openid'),
      name: sessionStorage.getItem('name'),
      phone: sessionStorage.getItem('phone'),
      address: JSON.stringify({
        receiver: $('#receiver').val(),
        phone: $('#phone').val(),
        country: $('#country').val(),
        city: encodeURI($('#city-picker').val()),
        location: $('#detail').val(),
      })
    };
    //console.log(typeof($('#city-picker').val()));
    console.log(reqBody);
    $.post('/api/user/address/', reqBody, function (call, stat) {
      if (stat == 'success') {
          mui.toast('添加地址成功！');
          window.location.href = '/user/address/'
      }
    })

  })
</script>
<!--<style>-->
  <!--.swipeout-content {-->
    <!--border-bottom:1px solid #e7e7e7;-->
  <!--}-->
  <!--.default:before {-->
    <!--position: absolute;-->
    <!--content: '';-->
    <!--width: 0;-->
    <!--height:0;-->
    <!--border-color:#0894ec transparent transparent #0894ec;-->
    <!--border-width: .5rem;-->
    <!--border-style: solid;-->
    <!--top:0;-->
    <!--z-index: 9999;-->
  <!--}-->
<!--</style>-->

<!--<div class="page">-->
  <!--<header class="bar bar-nav">-->
    <!--<h1 class="title">收件信息</h1>-->
  <!--</header>-->



  <!--<div class="content">-->
    <!--<div class="content-block" style="padding: 0;">-->
      <!--<div class="list-block media-list">-->
        <!--<ul class="address-list-container" style="border: none;">-->

          <!--&lt;!&ndash;<li class="swipeout">&ndash;&gt;-->
            <!--&lt;!&ndash;&lt;!&ndash; Usual list element wrapped with "swipeout-content" &ndash;&gt;&ndash;&gt;-->
            <!--&lt;!&ndash;<div class="swipeout-content">&ndash;&gt;-->
              <!--&lt;!&ndash;&lt;!&ndash; Your list element here &ndash;&gt;&ndash;&gt;-->
              <!--&lt;!&ndash;<a href="#" class="item-link item-content">&ndash;&gt;-->
                <!--&lt;!&ndash;<div class="item-inner" style="background: none;">&ndash;&gt;-->
                  <!--&lt;!&ndash;<div class="item-title-row">&ndash;&gt;-->
                    <!--&lt;!&ndash;<div class="item-title">张三</div>&ndash;&gt;-->
                    <!--&lt;!&ndash;<div class="item-after">15106205583</div>&ndash;&gt;-->
                  <!--&lt;!&ndash;</div>&ndash;&gt;-->
                  <!--&lt;!&ndash;<div class="item-subtitle">江苏省苏州市</div>&ndash;&gt;-->
                  <!--&lt;!&ndash;<div class="item-text">路什么路什么号什么路什么路什么号什么路什么路什么号</div>&ndash;&gt;-->
                <!--&lt;!&ndash;</div>&ndash;&gt;-->
              <!--&lt;!&ndash;</a>&ndash;&gt;-->
            <!--&lt;!&ndash;</div>&ndash;&gt;-->
            <!--&lt;!&ndash;<div class="swipeout-actions-right">&ndash;&gt;-->
              <!--&lt;!&ndash;<a href="#" style="background: #c30;">删除</a>&ndash;&gt;-->
            <!--&lt;!&ndash;</div>&ndash;&gt;-->
          <!--&lt;!&ndash;</li>&ndash;&gt;-->
        <!--</ul>-->
        <!--<p style="margin:1.75rem .7rem;"><a class="button button-fill new-address">新增</a></p>-->

      <!--</div>-->
    <!--</div>-->

  <!--</div>-->


<!--</div>-->
<!--<script>-->
  <!--$(function(){-->
      <!--console.log('aaa');-->
    <!--$('.new-address').click(function(){-->
        <!--window.location.href = "/user/editAddress";-->
    <!--});-->

    <!--$.showIndicator();-->
    <!--$.get('/user/getAddress',function(res){-->
        <!--console.log(res);-->
        <!--var html = '';-->
        <!--if(res.status == "success"){-->
          <!--var data = res.data;-->
          <!--for(var i in data){-->
            <!--html += '<li data-id="' + data[i].id + '" class="swipeout default"><div class="swipeout-content">' +-->
              <!--'<a href="#" class="item-link item-content"><div class="item-inner" style="background: none;border: none;">' +-->
              <!--'<div class="item-title-row"><div class="item-title">' + data[i].name + '</div>' +-->
              <!--'<div class="item-after">' + data[i].phone + '</div></div>' +-->
              <!--'<div class="item-subtitle">' + data[i].province + data[i].city + '</div>' +-->
              <!--'<div class="item-text">' + data[i].street + '</div></div></a></div>' +-->
              <!--'<div class="swipeout-actions-right"><a href="#" style="background: #c30;">删除</a></div></li>';-->
          <!--}-->
          <!--$('.address-list-container').html(html);-->
          <!--$('.address-list-container .swipeout:eq(0)').css('border-top','1px solid #e7e7e7');-->

        <!--}-->
      <!--$.hideIndicator();-->
    <!--});-->


    <!--//删除-->
    <!--$(document).on('click','.swipeout-actions-right',function(){-->
<!--//      $.post('/user/');-->
      <!--var _this = $(this);-->
      <!--var id  = $(this).parents('.swipeout').data('id');-->
      <!--console.log(id);-->
      <!--$.showIndicator();-->
      <!--$.get('/user/delAddress/' + id,function(res){-->
        <!--console.log(res);-->
        <!--if(res == "success"){-->
          <!--$.hideIndicator();-->
          <!--_this.parents('.swipeout').remove();-->
          <!--$.toast('删除成功');-->

        <!--}-->

      <!--});-->
    <!--});-->


  <!--})-->
<!--</script>-->

